/*
 * @Description: 订单号详情（单号、时间、支付方式等）
 * @Author: ziwei.ma
 * @Date: 2019-07-24 09:52:32
 * @Last Modified by: ziwei.ma
 * @Last Modified time: 2019-08-29 19:30:21
 */
<template>
  <div class="order-number-detail-warpper flex-v">
    <div class="order-number-detail fontsize32 flex-v">
      <div><span class="public-color">订单编号：</span><span>{{orderDetailInfo.orderNo}}</span></div>
      <div><span class="public-color">创建时间：</span><span>{{orderDetailInfo.createTime}}</span></div>
      <div v-if="orderDetailInfo.paymentTime"><span class="public-color">支付时间：</span><span>{{orderDetailInfo.paymentTime}}</span></div>
      <div><span class="public-color">支付方式：</span><span>{{orderDetailInfo.paymentName}}</span></div>
      <!-- <div><span class="public-color">票价合计：</span><span>¥{{orderDetailInfo.payFee}}</span></div> -->
    </div>
    <div class="customer-service flex-h flex-vc">
      <span class="flex1 fontsize32">实付：<span class="font_small">¥</span>{{orderDetailInfo.payFee}}</span>
      <!-- <div
        class="fontsize28 baseColorNoAcitve"
        @click="jumpToTelephone"
      >联系客服</div>
      <i class="icon iconfont icon-phone baseColorNoAcitve" /> -->
    </div>
  </div>
</template>

<script>
import { dateFtt } from 'vue-xiaobu-utils'
export default {
  props: {
    orderDetailInfo: {
      type: Object,
      default: null
    }
  },
  computed: {

  },
  methods: {
    // jumpToTelephone() {
    //   let servicePhone = JSON.parse(localStorage.getItem('BCglobals')).PHONE
    //   window.location.assign('tel:' + servicePhone)
    // }
  },
  filters: {
    timeFormat(timestamp) {
      if (timestamp) {
        let date = new Date(timestamp)
        let timeStr = dateFtt('yyyy-MM-dd hh:mm:ss', date)
        return timeStr
      }
    }
  }
}
</script>

<style scoped>
.order-number-detail-warpper {
  width: 622px;
  min-height: 390px;
  padding: 0 32px;
  background-color: #fff;
  border-radius: 8px;
}
.order-number-detail {
  margin: 32px 0 16px 0;
}
.order-number-detail > div {
  margin: 16px 0;
}
.public-color {
  color: #999999;
}
.customer-service {
  border-top: 1px solid #dddddd;
  height: 111px;
}
.customer-service > span {
  color: #e84d38;
}
</style>
